<template>
  <div class="otherHome">
    <Other-Header bgColor="#5741d9"></Other-Header>
    <div class="coinInstructionsBox" :typeCode="typeCode">
      <!-- 上币申请说明内容 -->
      <div class="termsDetails">
        <div class="advertBox">
          <i></i>
          <h3 class="advertTitle">{{info.title}}</h3>
        </div>
        <div class="termsDetailsCon" v-html="info.details"></div>
      </div>
    </div>
    <Footer></Footer>
  </div>
</template>

<style lang="less" scoped>
.otherHome {
  background-color: #f7f8fc;
  position: absolute;
  min-height: 100%;
  width: 100%;
  padding-top: 100px;
}
.coinInstructionsBox {
  width: 1200px;
  box-sizing: border-box;
  margin: 20px auto 0;
  padding-bottom: 160px;
  /* 内容 */
  .termsDetails {
    background: rgba(255, 255, 255, 1);
    padding: 36px 60px 0;
    min-height: 790px;
    box-sizing: border-box;
    .advertBox {
      position: relative;
      padding-bottom: 24px;
      border-bottom: 1px solid #f0f2fd;
      .advertTitle {
        display: inline-block;
        font-size: 24px;
        font-familyA: PingFangSC-Semibold;
        font-weight: 600;
        color: rgba(51, 56, 94, 1);
        line-height: 33px;
        vertical-align: top;
      }
      i {
        position: absolute;
        width: 3px;
        height: 16px;
        background: #2D8DFE;
        border-radius: 2px;
        color: #33385e;
        margin-top: 7px;
        left: -20px;
      }
    }
    /deep/.termsDetailsCon {
      margin-top: 28px;
      padding-bottom: 70px;
      > p {
        font-size: 14px;
        font-familyA: PingFangSC-Regular;
        font-weight: 400;
        color: rgba(51, 56, 94, 1);
        line-height: 26px;
      }
      span {
        font-size: inherit;
        font-weight: inherit;
      }
    }
  }
}
</style>
<script>
import { api } from "@/api/api";
import OtherHeader from "@/components/otherHeader";
import Footer from "@/components/footer";
export default {
  components: {
    OtherHeader,
    Footer
  },
  data() {
    return {
      termsInfoInput: "",
      info: {}
    };
  },
  computed: {
    typeCode() {
      let typeCode = this.$route.query.typeCode;
      this.getAnnouncementList(typeCode);
      return typeCode;
    }
  },
  methods: {
    async getAnnouncementList(typeCode) {
      let params = {
        lang: "zh_CN",
        pageNum: 1,
        pageSize: 15,
        typeCode: typeCode
      };
      let res = await api.announcementList(params);
      let { code, data, msg } = res.data;

      if (code == 0) {
        this.info =
          data.records.map(item => ({
            id: item.id,
            title: item.title,
            details: item.content
          }))[0] || {};
      }
    }
  }
};
</script>